// store.ts
import { InjectionKey } from 'vue'
import createPersistedstate from 'vuex-persistedstate'
import { createStore, useStore as baseUseStore, Store } from 'vuex'
import { ITab, IUser } from './type'
import category from './user/index'
export interface State {
  [x: string]: any
  collapse: boolean
  tabs: Array<ITab>
  user: IUser
}

export const key: InjectionKey<Store<State>> = Symbol()

export const store = createStore<State>({
  state: {
    // 登录信息
    user: {
      name: '',
      token: ''
      // token: 'Bearer eyJhbGciOiJIUzUxMiJ9.eyJqdGkiOiI3YTgxMmYyYmMzMjI0MDU3YWY0YTgzZmU3ZDUyODhhNiIsInVzZXIiOiJhZG1pbiIsInN1YiI6ImFkbWluIn0.MDSGjS8EOaSt1M4c6doVVqa69Pp8_nLJNt9EgL1tddE06RXakZZUsuGt6xOrh11w1NSJQ_fKENKuKmpVzEbzfw'
    },
    // 左侧边栏
    collapse: false,
    // nav
    tabs: []
  },
  getters: {
    getCollapse(state: State) {
      return state.collapse
    },
    getTabs(state: State) {
      return state.tabs
    },
    getUser(state: State) {
      return state.user
    }
  },
  mutations: {
    setHasDynamicRouter(state: State, flag: boolean) {
      state.hasDynamicRouter = flag
    },
    setCollapse(state: State, collapse: boolean) {
      state.collapse = collapse
    },
    addTab(state: State, tab) {
      if (state.tabs.some((item) => item.path === tab.path)) return
      state.tabs.push({
        title: tab.title,
        path: tab.path
      })
    },
    setUser(state: State, user) {
      state.user = user
    },
    clearTabs(state: State) {
      state.tabs = []
    }
  },
  modules: {
    category
  },
  plugins: [
    createPersistedstate({
      key: 'zw-scrm-state'
    })
  ]
})

// 定义自己的 `useStore` 组合式函数
export function useStore() {
  return baseUseStore(key)
}
